<template>
	<view style="width: 100%; height: 768px; background-color:#F0F0F0;">
		<view style="width: 100%; height: 480px; background-color: #fff;">
			<view style="width: 100%; height: 20px; ;">
				<u-row>
					<u-col span=5><p style="line-height: 40px; margin-left: 12px;">距离订单取消时间：</p></u-col>
					<u-col span=3><view style="width: 100%; color: red;"><text>2</text>天<text class="bb">12</text>:<text class="bb">05</text>:<text class="bb">08</text></view></u-col>
				</u-row>
				<u-row>
					<u-col span=1.5><div style="width: 40px; height: 30px; background-color:#1890FF; color: #fff; text-align: center; line-height:2 ;">{{ordertilelist.orderFlag == 0?'家': ordertilelist.typeA == 2?'学校': (ordertilelist.typeA == 1 ? '公司' : '')}}</div></div></u-col>
					<u-col span=10.5><view style="heigh: 80px; width: 100%;">
					<p style="font-size: 20px; font-weight: 900; margin-top: 5px;">{{ordertilelist.addressfromA}}</p>
					<u-row>
					<u-col span=5><p style="margin-top: 10px; color: #c8c9cc">{{ordertilelist.addressName}}</p></u-col>
					<u-col span=9><p style="margin-top: 10px; color: #c8c9cc">{{ordertilelist.phoneA}}</p></u-col>
					</u-row>
					</view></u-col>
				</u-row>	
				<u-divider text=""></u-divider>
				<u-row style="margin-top: -5px;">
					<u-col span=4>
					<u--image class="image1" radius="10" width ="100px"  shape="filleted" height="110px"  :src="'http://101.43.223.224:8765/image/getImageById?id='+ordertilelist.imageid"  ></u--image>			
					</u-col>
					<u-col span=8>
						<view style=" width: 100%; height: 30px; margin-bottom: 30px; "><p class="p1">{{ordertilelist.productName}}</p></view>
							<view style="float: left; width: 100%; height: 30px; ">	
							<p  style="float: left; color: red;margin-top: 10px;">￥{{ordertilelist.startingPrice}}</p>
							</view>			
					</u-col>
				</u-row>
				<u-divider text=""></u-divider>
				<u-row>
					<u-col span=6 style="margin-left: 10px; line-height: 25px;" >运费： ￥0 </u-col>
					<u-col span=6><view>
						<p style="float: right; margin-right: 20px; color: red;" >￥{{ordertilelist.transactionPrice}}</p>
						<p style="float: right; margin-right: 10px;">合计:</p>
					</view></u-col>
				</u-row>
				<u-gap height="15" bgColor="#F0F0F0" style="margin-top: 8px;"></u-gap>
			<u-row>
				<u-col span=6 style="width: 100%; height: 30px; ">
				<p style="line-height: 45px; margin-left: 10px; ">订单编号</p>	
				</u-col>
				<u-col span=6>
					<view>
					<p style="float: right; margin-right: 10px; margin-top: 10px;">{{ordertilelist.orderNumber}}</p>
					</view>
				</u-col>
			</u-row>
			<u-divider text=""></u-divider>
			<u-row>
				<u-col span=6 style="width: 100%; height: 20px; ">
				<p style="line-height: 20px; margin-left: 10px; ">创建时间</p>	
				</u-col>
				<u-col span=6>
					<view>
					<p style="float: right; margin-right: 10px;" >{{ordertilelist.creationTime}}</p>
					</view>
				</u-col>
			</u-row>
			<u-divider text=""></u-divider>
			<u-row>
				<u-col span=6 style="width: 100%; height: 20px; ">
				<p style="line-height: 20px; margin-left: 10px; ">保证金</p>	
				</u-col>
				<u-col span=6>
					<view>
					<p style="float: right; margin-right: 10px;" >{{ordertilelist.earnestMoney}}</p>
					</view>
				</u-col>
			</u-row>
			<div style="width: 100%; height: 40px; background-color: #fff;position: fixed;bottom: 0px;z-index: 1000px;">
					
						<u-button type="primary" style="width: 110px; height: 50px; margin-right: 10px;" @click="fukuan()" text="立即付款"></u-button>
			</div>
			</view>
			<u-divider text="">
			</u-divider>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				src:'/static/yc.jpg',
				id:1,
				ordertilelist:{
					id: "", //id
					productId:'', //商品id
					productName:'',//商品名称
					quantity:'', //数量
					startingPrice:'',//起拍价
					transactionPrice:'',//成交价
					earnestMoney:'',//保证金
					addressfromA:'',
					phoneA:'',
					durationOfBidding:'', //竞拍时间
					commissionRate:'', //佣金比例
					deliveryType:'', //交货方式
					deliveryPoints:'', //交货地点
					addressId:'', //地址id
					clientAddress:'',
					orderNumber:'',//订单编号
					transactionTotal:'', //订单总价
					strikeTime:'', //付款时间
				},
			}
		},
		onLoad: function(option) {
				 
		// 获取上一页面传输过来的参数
		    this.id = option.id
		 console.log("aaa"+this.id)
		   },
		mounted () {
		  this.ordertaillist() //订单详情
		},
		methods: {
			fukuan(){
				var that = this
					uni.request({
							url: "http://"+that.$host+":"+that.$port+"/order/clientPaid",
							data:{
							id:that.id	
							},
							method: 'GET',
							dataType: 'json',
					success: (res) => {
							uni.showToast({ //添加成功提示
							 icon: 'success',
							 title: '发布成功',
							 // 显示时长时间为1000秒
							 duration: 1000
							})
							this.timer = setInterval(function () { 
								uni.navigateBack({data:1})
							},1000) 
					},
							});
			},
			ordertaillist(){
				var that = this
				uni.request({
						url: "http://"+that.$host+":"+that.$port+"/order/clientList/"+that.id,               
						method: 'GET',
						dataType: 'json',
						
						success: (res) => {
						this.ordertilelist = res.data.obj
							console.log(this.ordertilelist.productName)
						this.ordertilelist.forEach(function(a){
						})
							},                  	
						});
			},
		}
	}
</script>

<style>
.bb{
    color: red;
    background-color: white;
	
    border-radius: 5px 5px 5px 5px;
}
</style>
